<template>
	<view class="page">
		<status-bar title='选择地区'></status-bar>
		<city-select
			@cityClick="cityClick"
			:formatName="formatName"
			:activeCity="activeCity"
			:hotCity="hotCity"
			:obtainCitys="obtainCitys"
			:isSearch="true"
			ref="citys"
		></city-select>
	</view>
</template>

<script>
	import citySelect from '@/components/city-select/city-select.vue'
	import {mapMutations} from 'vuex'
	export default {
		components: {
			citySelect
		},
		data() {
			return {
				//需要构建索引参数的名称（注意：传递的对象里面必须要有这个名称的参数）
				formatName: 'title',
				//当前城市
				activeCity: '',
				//热门城市
				hotCity:'',
				//显示的城市数据
				obtainCitys:[]
			};
		},
		onLoad() {
			this.formatName = 'cityName'
			this.activeCity = {
				cityName: uni.getStorageSync('city'),
				cityCode: 110100
			}
			this.hotCity = [
				{cityName: '重庆',cityCode: 110100},
				{cityName: '上海',cityCode: 110100},
				{cityName: '北京',cityCode: 110102},
				{cityName: '天津',cityCode: 110100},
				{cityName: '南京',cityCode: 110100},
				{cityName: '呼和浩特市',cityCode: 110102}
			]
			uni.request({
				url: 'https://msraimgcdn.mogoie.com/json/citys.json',
				success: res => {
					this.obtainCitys = res.data
				}
			})
		},
		methods: {
			...mapMutations(['changeCity']),
			cityClick(item) {
				uni.setStorageSync('city',item.cityName)
				this.changeCity(item.cityName)
				this.$common.back()
			}
		}
	}
</script>

<style lang="scss" scoped>

</style>
